<!-- 发票撤销 -->
<template>
	<a-modal v-bind="options" title="撤销">
		<p>撤销之后该发票中的账单将在所属合同的可开发票页面中恢复,确定要撤销该发票吗?</p>
		<template #footer>
			<a-button @click="emits('close')">取消</a-button>
			<a-button type="primary" :loading="loading" @click="sure">确定</a-button>
		</template>
	</a-modal>
</template>

<script setup lang="ts">
	import {reactive, ref, toRef} from 'vue'
	import {invoicingRevoke} from '@/api/invoicing-history'
	import {message} from 'ant-design-vue'

	const props = defineProps<{
		id?: string
		invoiceInfoId?: string
		visible: boolean
	}>()
	const emits = defineEmits(['update:visible', 'close', 'success'])

	const loading = ref(false)

	const options = reactive({
		width: 520,
		centered: true,
		maskClosable: false,
		destroyOnClose: true,
		confirmLoading: true,
		visible: toRef(props, 'visible'),
		onCancel() {
			// emits('close')
			emits('update:visible', false)
			setTimeout(() => emits('close'), 100)
		}
	})

	const sure = () => {
		invoicingRevoke(props.id as string)
			.then(() => {
				message.success('撤销成功')
				emits('success')
				emits('close')
			})
			.catch(error => {
				emits('close')
				console.error(error)
			})
	}
</script>

<style scoped></style>
